<template>
  <view class="center column">
    <image @load="load" v-for="(url,index) in props.detailUrls" :key="index" :src="url.url" mode="widthFix" ></image>
    <image v-if="loading" class="loading" src="/static/images/loading.gif" mode=""></image>
    <text v-else class="footer-text">已经到达底部，没有更多内容了</text>
  </view>
</template>

<script setup lang="ts">
  import {
    ref,nextTick
  } from 'vue'

  const props = defineProps({
    ce:{
        type:Number,
        default:13
    },
    
    detailUrls: {
      type: Array,
      default: () => [
        
      ]
    }
  })
  const loading = ref(true)
  const load = () => {
    loading.value = false
  }
</script>

<style lang="scss" scope>
  image {
    width: 100%;
  }

  .loading {
    height: 90rpx;
    width: 90rpx;
    margin-top: 50rpx;
  }

  .footer-text {
    font-size: 30rpx;
    color: #777;
    margin-top: 20rpx 0;
  }
</style>
